<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>乐购试做</title>
    <!-- 1. 引入插件样式 -->
    
    
    <link rel="stylesheet" href="css/post.css">
    <!-- 1. 引入插件样式 -->
    <link rel="stylesheet" href="css/slider.css">
    <style>
    </style>
</head>

<body>
    <!--开始排版-->
    <!--顶部通栏-->
    <header class="topl cf">
        <div class="contents top1">
            <a href="index.html" class="wz">legochina.cn</a>
            <p>欢迎光临<a href="index.html">乐购</a>，请
                <span><a href="login.html">登录</a>\</span>
                <a href="post.html" id="posts">注册</a>
            </p>
        </div>
        <!--顶部导航栏-->
    </header>
    <div class="contents topnav cf">
        
        <img src="images/post01.jpg" class="logo">
       
        <!--顶部主导航栏-->
       <h1>欢迎登录</h1>
       <p class="fl2">已有账号，请<a href="###">登陆</a></p>

    </div>
    <!--顶部下面的商品选项卡-->
    <div class="bannerlog cf">
        <div class="contents logbk1">
           <form class="logbk" id="myform" action="###">
            <ul class="zclb">
                <li>
                    <p><span>用户名</span><input type="text" name="username"id="username" placeholder="您的账户名和登录名"/></p>
                    <p><i>支持中文、英文、数字、“-”、“_”的组合，4-20个字符</i></p>
                </li>
               
                <li>
                    <p><span>设置密码</span><input type="password" name="pwd"id="pwd"  placeholder="建议使用两种或两种及以上的组合"/></p>
                    <p><i>建议使用中文、英文、数字、“-”、“_”的组合，4-20个字符</i></p>
                </li>
                <li>
                    <p><span>再次密码</span><input type="password" name="pwd2"id="pwd2"  placeholder="请再次输入密码"/></p>
                    <p><i>请再次输入密码</i></p>
                </li>
                <li>
                    <p><span>中国+86</span><input type="tel" name="tel"id="tel" placeholder="建议使用常用手机号"/></p>
                    <p><i>建议输入常用手机号</i></p>
                </li>
                <li>
                    <p class="yz"><span>验证码</span><input type="text" name="vfc"id="vfc" placeholder="请输入验证码"/><canvas id="canvas" width="100" height="30"></canvas></p>
                </li>
                <li>
                    <p class="sjyz"><span>手机验证码</span><input type="text" name="sjvfc"id="sjvfc" placeholder="请输入手机验证码"/><button class="hq" type="button">获取验证码</button></p>
                </li>
            </ul> 
            <label><p class="zy"><input type="radio" name="username" value="注册"/>我已阅读并同意<a href="###">《京东用户注册协议》</a></p></label>
            <button class="tzc" id="btn" type="submit">立即注册</button>
            
           </form>
        </div>
    </div>

        <!--顶部下面的轮播图-->
    
       
    <!-- 轮播图下面的今日推荐 -->
    
    <!-- 推荐下面的图书 -->
   
    <!-- 图书下面的服装 -->
    
    <!-- 服装下面的户外 -->
   
    <!-- 户外下面的童装 -->
    
    <!-- 童装下面的居家 -->
   
    <!-- 居家下面的推广 -->
    
    <!-- 推广下面的底部广告 -->
   
    <!-- 推广下面的底部广告 -->
    
    <!-- 页面的底部页脚 -->
    <div class="contents lfot cf">
        <p class="lik">
            <a href="###" class="lf1">公司简介</a>
            <a href="###">Investor Relations</a>
            <a href="###">网址联盟</a>
            <a href="###">乐购招商</a>
            <a href="###">机构销售</a>
            <a href="###">手机乐购</a>
            <a href="###">官方Blog</a>
            <a href="###">热词搜索</a>
        </p>
        <p>Copyright &copy; 乐购网 2014-2016, All rights reserved </p>
    </div>





    <!-- 1. 引入jQuery -->
    <script src="./lib/jquery.min.js"></script>
    <script src="./lib/jquery.validate.min.js"></script>

    <!-- 2. 引入轮播插件 -->
    
    <!-- 2. 引入轮播插件 -->
    

    <!-- 4. 引入当前页面js文件 -->
    <script src="./js/post.js"></script>
    <script>


        /*
        var ths=document.querySelectorAll(".theader li");
        var ds=document.querySelectorAll(".con div");
        let lastIndex = 0;
   for(let i=0;i<ths.length;i++){
       
    ths[i].addEventListener("mouseenter",function(){

       ths[lastIndex].classList.remove("d1");  
       this.classList.add("d1")  
       
       ds[lastIndex].classList.remove("c1");
       ds[i].classList.add("c1");
       //重置上一个li标签的索引为当前li标签的索引
       lastIndex = i;   

       })
   }
        
        
        */
    </script>
</body>

</html>